<template>
	<view class="mainpadding">
		<view class="flexleft">
			<view class="margin_right1">
				<u-icon name="map"></u-icon>
			</view>
			<view class="ershiba xiaohui">当前城市</view>
		</view>
		<view class="flexbetween margin_top">
			<view class="sanshier">{{citytext}}</view>
			<view class="flexright"  @click="getlocation">
				<!-- <image class="weizhi margin_right1" src="../static/image/system/dw.png" mode=""></image> -->
				<view class="ershiba xiaohuang">重新定位</view>
			</view>
		</view>
		<view class="flexbetween margin_top ffffff radius mainpadding" v-if="type==1" @click="areashow=true">
			<view class="sanshier">选择区域</view>
			<view class="flexright">
				<view class="sanshier margin_right2">{{areaid?areatext:"全部"}}</view>
				<u-icon name="arrow-right" color="#C8C8C8"></u-icon>
			</view>
		</view>
		<view class="flexleft margin_top">
			<view class="margin_right1">
				<!-- <image class="weizhi margin_right1" src="../static/image/system/xz.png" mode=""></image> -->
			</view>
			<view class="ershiba xiaohui">选择城市</view>
		</view>
		<view class="margin_top">
			<u-index-list :index-list="indexList">
				<template v-for="(item, index) in itemArr">
					<u-index-item>
						<u-index-anchor :text="item.key"></u-index-anchor>
						<view class="list-cell" v-for="(cell, inde) in item.list" :key="inde" @click="checkcity(cell)">
							{{cell.name}}
						</view>
					</u-index-item>
				</template>
			</u-index-list>
		</view>
		<u-picker :show="areashow" :columns="arealist" keyName="name" @confirm="areaconfirm" @cancel="areashow=false"></u-picker>
	</view>
</template>

<script>0
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				longitude: "",
				latitude: "",
				citytext: "",
				cityid:"",
				areatext:"",
				areaid:"",
				indexList: [],
				itemArr: [],
				type:0,
				arealist:[],
					areashow:false,
			}
		},
		onLoad(options) {
			if(options.type){
				this.type = options.type
			}
			let storagecity = uni.getStorageSync("storagecity") || null
			if(storagecity){
				this.citytext = storagecity.citytext
				this.latitude = storagecity.latitude
				this.longitude = storagecity.longitude
				this.cityid = storagecity.cityid
			}else{
				this.getlocation()
			}
			let storagearea = uni.getStorageSync("storagearea") || null
			if(storagearea){
				this.areaid = storagearea.areaid
				this.areatext = storagearea.areatext
			}
			this.getcitylist()
			this.getarea()
		},
		methods: {
			citychange(){
				this.areatext = ""
				this.areaid = ""
				let area = {
					areatext:"",
					areaid:""
				}
				uni.setStorageSync("storagearea", area)
				this.getarea()
			},
			areaconfirm(e) {
				this.areashow = false
				this.areaid = e.value[0].id
				this.areatext = e.value[0].name
				let area = {
					areatext:this.areatext,
					areaid:this.areaid
				}
				uni.setStorageSync("storagearea", area)
				uni.$emit("selectareafn",area)
			},
			getarea(){
				httpRequest.request('/api/index/getAreaIndex', 'POST', {
					city_id:this.cityid
				}).then(res => {
					this.arealist = []
					this.arealist.push(res.data)
				}).catch(err => {})
			},
			getlocation() {
				uni.showLoading({
					mask:true,
					title:"请稍后"
				})
				let _this = this
				uni.getLocation({
					type: 'wgs84',
					success: function(res) {
						_this.latitude = res.latitude
						_this.longitude = res.longitude
						_this.getcityInfo()
					},
					fail(err) {
						uni.hideLoading()
						console.log(err, 23432);
					}
				});
			},
		
			getcityInfo() {
				httpRequest.request('/api/index/getCurrCity', 'POST', {
					lat: this.latitude,
					lng: this.longitude
				}, false, false, true).then(res => {
					uni.hideLoading()
					let data = {
						citytext:res.data.pinfo.name,
						latitude:this.latitude,
						longitude:this.longitude,
						cityid:res.data.pid,
					}
					this.citytext = res.data.pinfo.name
					this.cityid = res.data.pid
					this.areatext = res.data.name
					this.areaid = res.data.id
					let area = {
						areatext:res.data.name,
						areaid:res.data.id
					}
					uni.setStorageSync("storagecity", data)
					uni.setStorageSync("storagearea", area)
					uni.$emit("selectareafn",area)
					uni.$emit("selectaddress",data)
					uni.$emit("selectaddressjd",data)
				})
			},
			
			checkcity(item){
				let lastdata = uni.getStorageSync("storagecity")
				let data = {
					citytext:item.name,
					latitude:lastdata.latitude,
					longitude:lastdata.longitude,
					cityid:item.id
				}
				this.cityid = item.id
				this.longitude = lastdata.latitude
				this.latitude = lastdata.longitude
				this.citytext = item.name
				uni.$emit("selectaddress",data)
				uni.$emit("selectaddressjd",data)
				if(this.type==1){
					this.citychange()
				}
				uni.setStorageSync("storagecity",data)
				
				if(this.type==0){
					uni.navigateBack(1)
				}
			},
			getcitylist(){
				httpRequest.request('/api/index/getCityList', 'POST', {
					keywords:this.keywords
				}, false, false, true).then(res => {
					let indexList = []
					res.data.forEach(item=>{
						indexList.push(item.key)
					})
					this.itemArr = res.data
					this.indexList = indexList
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	/deep/.u-border-bottom{
		background-color: #fff !important;
		border: none;
	}
	.list-cell {
		display: flex;
		box-sizing: border-box;
		width: 100%;
		padding: 10px 24rpx;
		overflow: hidden;
		color: #323233;
		font-size: 14px;
		line-height: 24px;
		border-bottom: 1rpx solid rgba(0, 0, 0, .06);
		background-color: #fff;
	}

	.weizhi {
		width: 28rpx;
		height: 28rpx;
	}
</style>